<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html>
<head>
	<title>信息管理系统</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<link href="/style/basic_layout.css" rel="stylesheet" type="text/css">
	<link href="/style/common_style.css" rel="stylesheet" type="text/css">
	<script type="text/javascript" src="/js/jquery/jquery.js"></script>
	<script type="text/javascript" src="/js/plugins/validation/jquery.validate.min.js"></script>
	<script type="text/javascript" src="/js/plugins/ajaxForm/jQueryForm.js"></script>
	<script type="text/javascript" src="/js/plugins/artDialog/jquery.artDialog.js?skin=blue"></script>
	<script type="text/javascript" src="/js/plugins/validation/messages_cn.js"></script>
	<script type="text/javascript" src="/js/plugins/My97DatePicker/My97DatePicker/WdatePicker.js"></script>
	<script type="text/javascript" src="/js/plugins/artDialog/iframeTools.js"></script>
	<script type="text/javascript" src="/js/commonAll.js"></script>
	<script type="text/javascript" src="/js/system/stockIncomeBill.js"></script>

	<script type="text/javascript">
		$(function () {
		    //新增明细
		    $(".appendRow").click(function () {
				var tr = $("#edit_table_body tr:first").clone();
				tr.find("input").val("");
				tr.find("span").html("");
				tr.appendTo("#edit_table_body");
            });

		    $(".btn_save").click(function () {
                //必须要有明细才提交表单
                if (!$("#edit_table_body tr:first [tag='pid']").val()) {
                    //提醒用户至少选择一个明细
                    showDialog("至少选择一个明细!");
                    return;
                }


                $.each($("#edit_table_body tr"),function (index, tr) {
					$(tr).find("[tag='pid']").prop("name","items["+index+"].product.id")
                    $(tr).find("[tag='number']").prop("name","items["+index+"].number")
                    $(tr).find("[tag='costPrice']").prop("name","items["+index+"].costPrice")
                    $(tr).find("[tag='remark']").prop("name","items["+index+"].remark")
                })
				//提交表单
				$("#editForm").submit();
            });

		    $(".Wdate").click(function () {
                WdatePicker({
                    readOnly:true,
                    maxDate:new Date()
                });
            })

		    $("#edit_table_body").on("click",".searchproduct",function () {
                var tr = $(this).closest("tr");
                $.dialog.open("/product/productListView.do",{
                    width:"90%",
                    height:"90%",
                    left:"50%",
                    top:"50%",
                    lock:true,
                    resize:false,
                    close:function () {
                        //获取子窗口共享的数据,然后清空
                        var data = $.dialog.data("data");
                        if(data){
                            $.dialog.removeData("data");
                            //获取data,然后回填数据
                            tr.find("[tag='name']").val(data.name);
                            tr.find("[tag='pid']").val(data.id);
                            tr.find("[tag='brand']").html(data.brandName);
                            tr.find("[tag='costPrice']").val(data.costPrice);
                            tr.find("[tag='number']").val(1);
                            tr.find("[tag='remark']").val(data.remark);
                        }
                    }
                });
            }).on("blur","input[tag='costPrice'],input[tag='number']",function () {
                var tr = $(this).closest("tr");
                var costPrice = tr.find("[tag='costPrice']").val() || 0;
                var number = tr.find("[tag='number']").val() || 0;
                tr.find("[tag='amount']").html(costPrice * number);
            }).on("click",".removeItem",function () {
				var tr = $(this).closest("tr");
                if($("#edit_table_body tr").size() == 1){
                    tr.find("input").val("");
                    tr.find("span").html("");
                    return;
				}
					tr.remove();
            })

        })

	</script>
</head>
<body>
<form id="editForm" action="/stockIncomeBill/saveOrUpdate.do" method="post">
	<input type="hidden" name="id" value="${entity.id}">
	<div id="container">
		<div id="nav_links">
			<span style="color: #1A5CC6;">用户编辑</span>
			<div id="page_close">
				<a>
					<img src="/images/common/page_close.png" width="20" height="20" style="vertical-align: text-top;"/>
				</a>
			</div>
		</div>
		<div class="ui_content">
			<table cellspacing="0" cellpadding="0" width="100%" align="left" border="0">
				<tr>
					<td class="ui_text_rt" width="140">入库单号</td>
					<td class="ui_text_lt">
						<input name="sn" value="${entity.sn}" class="ui_input_txt02"/>
					</td>
				</tr>

				<tr>
					<td class="ui_text_rt" width="140">仓库</td>
					<td class="ui_text_lt">
						<select id="depotId" class="ui_select01" name="depot.id">
							<c:forEach items="${depots}" var="ele">
							<option value="${ele.id}">${ele.name}</option>
							</c:forEach>
						</select>
				</tr>
				<script>
					$("#supplierId option[value='${entity.depot.id}']").prop("selected",true);
					$(function () {
						$(".Wdate").click(function () {
							WdatePicker({readOnly:true});
                        });
                    });
				</script>
					<tr>
						<td class="ui_text_rt" width="140">入库时间</td>
						<td class="ui_text_lt">
							<fmt:formatDate value="${entity.vdate}" var="vdate"/>
							<input name="vdate"  value="${vdate}"  class="ui_input_txt02 Wdate"  />
						</td>
					</tr>

				<tr>
					<td class="ui_text_rt" width="140">明细</td>
				</tr>
				<tr id="billDetails">
					<td></td>
					<td>
						<input type="button" value="添加明细" class="ui_input_btn01 appendRow"/>
						<table class="edit_table" cellspacing="0" cellpadding="0" border="0">
							<thead>
							<tr>
								<th width="10"></th>
								<th width="170">货品</th>
								<th width="100">品牌</th>
								<th width="80">价格</th>
								<th width="80">数量</th>
								<th width="100">金额小计</th>
								<th width="180">备注</th>
								<th width="120"></th>
							</tr>
							</thead>
							<tbody id="edit_table_body">
								<%--新增时,显示静态一行明细--%>
								<c:choose>
									<c:when test="${empty entity.id}">
										<tr>
											<td></td>
											<td>
												<input readonly class="ui_input_txt01" tag="name"/>
												<img src="/images/common/search.png" class="searchproduct"/>
												<input type="hidden"  tag="pid"/>
											</td>
											<td><span tag="brand"></span></td>
											<td><input type="number" tag="costPrice"  class="ui_input_txt01"/></td>
											<td><input type="number" tag="number"  class="ui_input_txt01"/></td>
											<td><span tag="amount"></span></td>
											<td><input tag="remark"  class="ui_input_txt01"/></td>
											<td>
												<a href="javascript:;" class="removeItem">删除明细</a>
											</td>
										</tr>
									</c:when>


									<%--更新操作是时,动态显示当前单据的明细--%>
									<c:otherwise>
										<c:forEach items="${entity.items}" var="item">
											<tr>
												<td></td>
												<td>
													<input readonly class="ui_input_txt01" value="${item.product.name}" tag="name"/>
													<img src="/images/common/search.png" class="searchproduct"/>
													<input type="hidden"  tag="pid" value="${item.product.id}"/>
												</td>
												<td><span tag="brand">${item.product.brandName}</span></td>
												<td><input type="number" tag="costPrice"  class="ui_input_txt01" value="${item.costPrice}"/></td>
												<td><input type="number" tag="number"  class="ui_input_txt01" value="${item.number}"/></td>
												<td><span tag="amount">${item.amount}</span></td>
												<td><input tag="remark"  class="ui_input_txt01" value="${item.remark}"/></td>
												<td>
													<a href="javascript:;" class="removeItem">删除明细</a>
												</td>
											</tr>
										</c:forEach>
									</c:otherwise>
								</c:choose>


							</tbody>
						</table>
					</td>
				</tr>

				<tr>
					<td>&nbsp;</td>
					<td class="ui_text_lt">
						&nbsp;<input type="button" value="确定保存"  class="ui_input_btn01 btn_save"/>
						&nbsp;<input id="cancelbutton" type="button" value="重置" class="ui_input_btn01"/>
					</td>
				</tr>
			</table>
		</div>
	</div>
</form>
</body>
</html>